<a href='https://github.com/angular/angular.js/edit/v1.6.x/src/ng/sce.js?message=docs($sce)%3A%20describe%20your%20change...#L457' class='improve-docs btn btn-primary'><i class="glyphicon glyphicon-edit">&nbsp;</i>Improve this Doc</a>



<a href='https://github.com/angular/angular.js/tree/v1.6.6/src/ng/sce.js#L457' class='view-source pull-right btn btn-primary'>
  <i class="glyphicon glyphicon-zoom-in">&nbsp;</i>View Source
</a>


<header class="api-profile-header">
  <h1 class="api-profile-header-heading">$sce</h1>
  <ol class="api-profile-header-structure naked-list step-list">
    
  <li>
    <a href="api/ng/provider/$sceProvider">- $sceProvider</a>
  </li>

    <li>
      - service in module <a href="api/ng">ng</a>
    </li>
  </ol>
</header>





<div class="api-profile-description">
  <p><code>$sce</code> is a service that provides Strict Contextual Escaping services to AngularJS.</p>
<h1 id="strict-contextual-escaping">Strict Contextual Escaping</h1>
<p>Strict Contextual Escaping (SCE) is a mode in which AngularJS constrains bindings to only render
trusted values. Its goal is to assist in writing code in a way that (a) is secure by default, and
(b) makes auditing for security vulnerabilities such as XSS, clickjacking, etc. a lot easier.</p>
<h2 id="overview">Overview</h2>
<p>To systematically block XSS security bugs, AngularJS treats all values as untrusted by default in
HTML or sensitive URL bindings. When binding untrusted values, AngularJS will automatically
run security checks on them (sanitizations, whitelists, depending on context), or throw when it
cannot guarantee the security of the result. That behavior depends strongly on contexts: HTML
can be sanitized, but template URLs cannot, for instance.</p>
<p>To illustrate this, consider the <code>ng-bind-html</code> directive. It renders its value directly as HTML:
we call that the <em>context</em>. When given an untrusted input, AngularJS will attempt to sanitize it
before rendering if a sanitizer is available, and throw otherwise. To bypass sanitization and
render the input as-is, you will need to mark it as trusted for that context before attempting
to bind it.</p>
<p>As of version 1.2, AngularJS ships with SCE enabled by default.</p>
<h2 id="in-practice">In practice</h2>
<p>Here&#39;s an example of a binding in a privileged context:</p>
<pre><code>&lt;input ng-model=&quot;userHtml&quot; aria-label=&quot;User input&quot;&gt;
&lt;div ng-bind-html=&quot;userHtml&quot;&gt;&lt;/div&gt;
</code></pre>
<p>Notice that <code>ng-bind-html</code> is bound to <code>userHtml</code> controlled by the user.  With SCE
disabled, this application allows the user to render arbitrary HTML into the DIV, which would
be an XSS security bug. In a more realistic example, one may be rendering user comments, blog
articles, etc. via bindings. (HTML is just one example of a context where rendering user
controlled input creates security vulnerabilities.)</p>
<p>For the case of HTML, you might use a library, either on the client side, or on the server side,
to sanitize unsafe HTML before binding to the value and rendering it in the document.</p>
<p>How would you ensure that every place that used these types of bindings was bound to a value that
was sanitized by your library (or returned as safe for rendering by your server?)  How can you
ensure that you didn&#39;t accidentally delete the line that sanitized the value, or renamed some
properties/fields and forgot to update the binding to the sanitized value?</p>
<p>To be secure by default, AngularJS makes sure bindings go through that sanitization, or
any similar validation process, unless there&#39;s a good reason to trust the given value in this
context.  That trust is formalized with a function call. This means that as a developer, you
can assume all untrusted bindings are safe. Then, to audit your code for binding security issues,
you just need to ensure the values you mark as trusted indeed are safe - because they were
received from your server, sanitized by your library, etc. You can organize your codebase to
help with this - perhaps allowing only the files in a specific directory to do this.
Ensuring that the internal API exposed by that code doesn&#39;t markup arbitrary values as safe then
becomes a more manageable task.</p>
<p>In the case of AngularJS&#39; SCE service, one uses <a href="api/ng/service/$sce#trustAs">$sce.trustAs</a>
(and shorthand methods such as <a href="api/ng/service/$sce#trustAsHtml">$sce.trustAsHtml</a>, etc.) to
build the trusted versions of your values.</p>
<h2 id="how-does-it-work-">How does it work?</h2>
<p>In privileged contexts, directives and code will bind to the result of <a href="api/ng/service/$sce#getTrusted">$sce.getTrusted(context, value)</a> rather than to the value directly.  Think of this function as
a way to enforce the required security context in your data sink. Directives use <a href="api/ng/service/$sce#parseAs">$sce.parseAs</a> rather than <code>$parse</code> to watch attribute bindings, which performs
the <a href="api/ng/service/$sce#getTrusted">$sce.getTrusted</a> behind the scenes on non-constant literals. Also,
when binding without directives, AngularJS will understand the context of your bindings
automatically.</p>
<p>As an example, <a href="api/ng/directive/ngBindHtml">ngBindHtml</a> uses <a href="api/ng/service/$sce#parseAsHtml">$sce.parseAsHtml(binding expression)</a>.  Here&#39;s the actual code (slightly
simplified):</p>
<pre><code>var ngBindHtmlDirective = [&#39;$sce&#39;, function($sce) {
  return function(scope, element, attr) {
    scope.$watch($sce.parseAsHtml(attr.ngBindHtml), function(value) {
      element.html(value || &#39;&#39;);
    });
  };
}];
</code></pre>
<h2 id="impact-on-loading-templates">Impact on loading templates</h2>
<p>This applies both to the <a href="api/ng/directive/ngInclude"><code>ng-include</code></a> directive as well as
<code>templateUrl</code>&#39;s specified by <a href="guide/directive">directives</a>.</p>
<p>By default, Angular only loads templates from the same domain and protocol as the application
document.  This is done by calling <a href="api/ng/service/$sce#getTrustedResourceUrl">$sce.getTrustedResourceUrl</a> on the template URL.  To load templates from other domains and/or
protocols, you may either <a href="api/ng/provider/$sceDelegateProvider#resourceUrlWhitelist">whitelist
them</a> or <a href="api/ng/service/$sce#trustAsResourceUrl">wrap it</a> into a trusted value.</p>
<p><em>Please note</em>:
The browser&#39;s
<a href="https://code.google.com/p/browsersec/wiki/Part2#Same-origin_policy_for_XMLHttpRequest">Same Origin Policy</a>
and <a href="http://www.w3.org/TR/cors/">Cross-Origin Resource Sharing (CORS)</a>
policy apply in addition to this and may further restrict whether the template is successfully
loaded.  This means that without the right CORS policy, loading templates from a different domain
won&#39;t work on all browsers.  Also, loading templates from <code>file://</code> URL does not work on some
browsers.</p>
<h2 id="this-feels-like-too-much-overhead">This feels like too much overhead</h2>
<p>It&#39;s important to remember that SCE only applies to interpolation expressions.</p>
<p>If your expressions are constant literals, they&#39;re automatically trusted and you don&#39;t need to
call <code>$sce.trustAs</code> on them (e.g.
<code>&lt;div ng-bind-html=&quot;&#39;&lt;b&gt;implicitly trusted&lt;/b&gt;&#39;&quot;&gt;&lt;/div&gt;</code>) just works. The <code>$sceDelegate</code> will
also use the <code>$sanitize</code> service if it is available when binding untrusted values to
<code>$sce.HTML</code> context. AngularJS provides an implementation in <code>angular-sanitize.js</code>, and if you
wish to use it, you will also need to depend on the <a href="api/ngSanitize"><code>ngSanitize</code></a> module in
your application.</p>
<p>The included <a href="api/ng/service/$sceDelegate">$sceDelegate</a> comes with sane defaults to allow you to load
templates in <code>ng-include</code> from your application&#39;s domain without having to even know about SCE.
It blocks loading templates from other domains or loading templates over http from an https
served document.  You can change these by setting your own custom <a href="api/ng/provider/$sceDelegateProvider#resourceUrlWhitelist">whitelists</a> and <a href="api/ng/provider/$sceDelegateProvider#resourceUrlBlacklist">blacklists</a> for matching such URLs.</p>
<p>This significantly reduces the overhead.  It is far easier to pay the small overhead and have an
application that&#39;s secure and can be audited to verify that with much more ease than bolting
security onto an application later.</p>
<p><a name="contexts"></a></p>
<h2 id="what-trusted-context-types-are-supported-">What trusted context types are supported?</h2>
<table>
<thead>
<tr>
<th>Context</th>
<th>Notes</th>
</tr>
</thead>
<tbody>
<tr>
<td><code>$sce.HTML</code></td>
<td>For HTML that&#39;s safe to source into the application.  The <a href="api/ng/directive/ngBindHtml">ngBindHtml</a> directive uses this context for bindings. If an unsafe value is encountered, and the <a href="api/ngSanitize/service/$sanitize">$sanitize</a> service is available (implemented by the <a href="api/ngSanitize">ngSanitize</a> module) this will sanitize the value instead of throwing an error.</td>
</tr>
<tr>
<td><code>$sce.CSS</code></td>
<td>For CSS that&#39;s safe to source into the application.  Currently, no bindings require this context. Feel free to use it in your own directives.</td>
</tr>
<tr>
<td><code>$sce.URL</code></td>
<td>For URLs that are safe to follow as links.  Currently unused (<code>&lt;a href=</code>, <code>&lt;img src=</code>, and some others sanitize their urls and don&#39;t constitute an SCE context.)</td>
</tr>
<tr>
<td><code>$sce.RESOURCE_URL</code></td>
<td>For URLs that are not only safe to follow as links, but whose contents are also safe to include in your application.  Examples include <code>ng-include</code>, <code>src</code> / <code>ngSrc</code> bindings for tags other than <code>IMG</code>, <code>VIDEO</code>, <code>AUDIO</code>, <code>SOURCE</code>, and <code>TRACK</code> (e.g. <code>IFRAME</code>, <code>OBJECT</code>, etc.)  <br><br>Note that <code>$sce.RESOURCE_URL</code> makes a stronger statement about the URL than <code>$sce.URL</code> does (it&#39;s not just the URL that matters, but also what is at the end of it), and therefore contexts requiring values trusted for <code>$sce.RESOURCE_URL</code> can be used anywhere that values trusted for <code>$sce.URL</code> are required.</td>
</tr>
<tr>
<td><code>$sce.JS</code></td>
<td>For JavaScript that is safe to execute in your application&#39;s context.  Currently, no bindings require this context.  Feel free to use it in your own directives.</td>
</tr>
</tbody>
</table>
<p>Be aware that <code>a[href]</code> and <code>img[src]</code> automatically sanitize their URLs and do not pass them
through <a href="api/ng/service/$sce#getTrusted">$sce.getTrusted</a>. There&#39;s no CSS-, URL-, or JS-context bindings
in AngularJS currently, so their corresponding <code>$sce.trustAs</code> functions aren&#39;t useful yet. This
might evolve.</p>
<h2 id="format-of-items-in-link-ng-scedelegateprovider-resourceurlwhitelist-resourceurlwhitelist-link-ng-scedelegateprovider-resourceurlblacklist-blacklist-a-name-resourceurlpatternitem-a-">Format of items in <a href="api/ng/provider/$sceDelegateProvider#resourceUrlWhitelist">resourceUrlWhitelist</a>/<a href="api/ng/provider/$sceDelegateProvider#resourceUrlBlacklist">Blacklist</a> <a name="resourceUrlPatternItem"></a></h2>
<p> Each element in these arrays must be one of the following:</p>
<ul>
<li><strong>&#39;self&#39;</strong><ul>
<li>The special <strong>string</strong>, <code>&#39;self&#39;</code>, can be used to match against all URLs of the <strong>same
domain</strong> as the application document using the <strong>same protocol</strong>.</li>
</ul>
</li>
<li><strong>String</strong> (except the special value <code>&#39;self&#39;</code>)<ul>
<li>The string is matched against the full <em>normalized / absolute URL</em> of the resource
being tested (substring matches are not good enough.)</li>
<li>There are exactly <strong>two wildcard sequences</strong> - <code>*</code> and <code>**</code>.  All other characters
match themselves.</li>
<li><code>*</code>: matches zero or more occurrences of any character other than one of the following 6
characters: &#39;<code>:</code>&#39;, &#39;<code>/</code>&#39;, &#39;<code>.</code>&#39;, &#39;<code>?</code>&#39;, &#39;<code>&amp;</code>&#39; and &#39;<code>;</code>&#39;.  It&#39;s a useful wildcard for use
in a whitelist.</li>
<li><code>**</code>: matches zero or more occurrences of <em>any</em> character.  As such, it&#39;s not
appropriate for use in a scheme, domain, etc. as it would match too much.  (e.g.
<a href="http://**.example.com/">http://**.example.com/</a> would match <a href="http://evil.com/?ignore=.example.com/">http://evil.com/?ignore=.example.com/</a> and that might
not have been the intention.)  Its usage at the very end of the path is ok.  (e.g.
<a href="http://foo.example.com/templates/**">http://foo.example.com/templates/**</a>).</li>
</ul>
</li>
<li><strong>RegExp</strong> (<em>see caveat below</em>)<ul>
<li><em>Caveat</em>:  While regular expressions are powerful and offer great flexibility,  their syntax
(and all the inevitable escaping) makes them <em>harder to maintain</em>.  It&#39;s easy to
accidentally introduce a bug when one updates a complex expression (imho, all regexes should
have good test coverage).  For instance, the use of <code>.</code> in the regex is correct only in a
small number of cases.  A <code>.</code> character in the regex used when matching the scheme or a
subdomain could be matched against a <code>:</code> or literal <code>.</code> that was likely not intended.   It
is highly recommended to use the string patterns and only fall back to regular expressions
as a last resort.</li>
<li>The regular expression must be an instance of RegExp (i.e. not a string.)  It is
matched against the <strong>entire</strong> <em>normalized / absolute URL</em> of the resource being tested
(even when the RegExp did not have the <code>^</code> and <code>$</code> codes.)  In addition, any flags
present on the RegExp (such as multiline, global, ignoreCase) are ignored.</li>
<li>If you are generating your JavaScript from some other templating engine (not
recommended, e.g. in issue <a href="https://github.com/angular/angular.js/issues/4006">#4006</a>),
remember to escape your regular expression (and be aware that you might need more than
one level of escaping depending on your templating engine and the way you interpolated
the value.)  Do make use of your platform&#39;s escaping mechanism as it might be good
enough before coding your own.  E.g. Ruby has
<a href="http://www.ruby-doc.org/core-2.0.0/Regexp.html#method-c-escape">Regexp.escape(str)</a>
and Python has <a href="http://docs.python.org/library/re.html#re.escape">re.escape</a>.
Javascript lacks a similar built in function for escaping.  Take a look at Google
Closure library&#39;s <a href="http://docs.closure-library.googlecode.com/git/closure_goog_string_string.js.source.html#line962">goog.string.regExpEscape(s)</a>.</li>
</ul>
</li>
</ul>
<p>Refer <a href="api/ng/provider/$sceDelegateProvider">$sceDelegateProvider</a> for an example.</p>
<h2 id="show-me-an-example-using-sce-">Show me an example using SCE.</h2>
<p>

<div>
  <plnkr-opener example-path="examples/example-sce-service"></plnkr-opener>

  <div class="runnable-example"
      path="examples/example-sce-service"
      module="mySceApp"
      deps="angular-sanitize.js"
      name="sce-service">

  
    <div class="runnable-example-file" 
      name="index.html"
      language="html"
      type="html">
      <pre><code>&lt;div ng-controller=&quot;AppController as myCtrl&quot;&gt;&#10;  &lt;i ng-bind-html=&quot;myCtrl.explicitlyTrustedHtml&quot; id=&quot;explicitlyTrustedHtml&quot;&gt;&lt;/i&gt;&lt;br&gt;&lt;br&gt;&#10;  &lt;b&gt;User comments&lt;/b&gt;&lt;br&gt;&#10;  By default, HTML that isn&#39;t explicitly trusted (e.g. Alice&#39;s comment) is sanitized when&#10;  $sanitize is available.  If $sanitize isn&#39;t available, this results in an error instead of an&#10;  exploit.&#10;  &lt;div class=&quot;well&quot;&gt;&#10;    &lt;div ng-repeat=&quot;userComment in myCtrl.userComments&quot;&gt;&#10;      &lt;b&gt;{{userComment.name}}&lt;/b&gt;:&#10;      &lt;span ng-bind-html=&quot;userComment.htmlComment&quot; class=&quot;htmlComment&quot;&gt;&lt;/span&gt;&#10;      &lt;br&gt;&#10;    &lt;/div&gt;&#10;  &lt;/div&gt;&#10;&lt;/div&gt;</code></pre>
    </div>
  
    <div class="runnable-example-file" 
      name="script.js"
      language="js"
      type="js">
      <pre><code>angular.module(&#39;mySceApp&#39;, [&#39;ngSanitize&#39;])&#10;.controller(&#39;AppController&#39;, [&#39;$http&#39;, &#39;$templateCache&#39;, &#39;$sce&#39;,&#10;  function AppController($http, $templateCache, $sce) {&#10;    var self = this;&#10;    $http.get(&#39;test_data.json&#39;, {cache: $templateCache}).then(function(response) {&#10;      self.userComments = response.data;&#10;    });&#10;    self.explicitlyTrustedHtml = $sce.trustAsHtml(&#10;        &#39;&lt;span onmouseover=&quot;this.textContent=&amp;quot;Explicitly trusted HTML bypasses &#39; +&#10;        &#39;sanitization.&amp;quot;&quot;&gt;Hover over this text.&lt;/span&gt;&#39;);&#10;  }]);</code></pre>
    </div>
  
    <div class="runnable-example-file" 
      name="test_data.json"
      language="json"
      type="json">
      <pre><code>[&#10;  { &quot;name&quot;: &quot;Alice&quot;,&#10;    &quot;htmlComment&quot;:&#10;        &quot;&lt;span onmouseover=&#39;this.textContent=\&quot;PWN3D!\&quot;&#39;&gt;Is &lt;i&gt;anyone&lt;/i&gt; reading this?&lt;/span&gt;&quot;&#10;  },&#10;  { &quot;name&quot;: &quot;Bob&quot;,&#10;    &quot;htmlComment&quot;: &quot;&lt;i&gt;Yes!&lt;/i&gt;  Am I the only other one?&quot;&#10;  }&#10;]</code></pre>
    </div>
  
    <div class="runnable-example-file" 
      name="protractor.js"
      type="protractor"
      language="js">
      <pre><code>describe(&#39;SCE doc demo&#39;, function() {&#10;  it(&#39;should sanitize untrusted values&#39;, function() {&#10;    expect(element.all(by.css(&#39;.htmlComment&#39;)).first().getAttribute(&#39;innerHTML&#39;))&#10;        .toBe(&#39;&lt;span&gt;Is &lt;i&gt;anyone&lt;/i&gt; reading this?&lt;/span&gt;&#39;);&#10;  });&#10;&#10;  it(&#39;should NOT sanitize explicitly trusted values&#39;, function() {&#10;    expect(element(by.id(&#39;explicitlyTrustedHtml&#39;)).getAttribute(&#39;innerHTML&#39;)).toBe(&#10;        &#39;&lt;span onmouseover=&quot;this.textContent=&amp;quot;Explicitly trusted HTML bypasses &#39; +&#10;        &#39;sanitization.&amp;quot;&quot;&gt;Hover over this text.&lt;/span&gt;&#39;);&#10;  });&#10;});</code></pre>
    </div>
  

    <iframe class="runnable-example-frame" ng-src="{{getExampleIndex('examples/example-sce-service')}}" name="example-sce-service"></iframe>
  </div>
</div>


</p>
<h2 id="can-i-disable-sce-completely-">Can I disable SCE completely?</h2>
<p>Yes, you can.  However, this is strongly discouraged.  SCE gives you a lot of security benefits
for little coding overhead.  It will be much harder to take an SCE disabled application and
either secure it on your own or enable SCE at a later stage.  It might make sense to disable SCE
for cases where you have a lot of existing code that was written before SCE was introduced and
you&#39;re migrating them a module at a time. Also do note that this is an app-wide setting, so if
you are writing a library, you will cause security bugs applications using it.</p>
<p>That said, here&#39;s how you can completely disable SCE:</p>
<pre><code>angular.module(&#39;myAppWithSceDisabledmyApp&#39;, []).config(function($sceProvider) {
  // Completely disable SCE.  For demonstration purposes only!
  // Do not use in new projects or libraries.
  $sceProvider.enabled(false);
});
</code></pre>

</div>




<div>
  

  

  <h2 id="usage">Usage</h2>
    
      <p><code>$sce();</code></p>


    

    
    
    

  
<h2>Methods</h2>
<ul class="methods">
  <li id="isEnabled">
    <h3><p><code>isEnabled();</code></p>

</h3>
    <div><p>Returns a boolean indicating if SCE is enabled.</p>
</div>

    

    

    

    
    <h4>Returns</h4>
    <table class="variables-matrix return-arguments">
  <tr>
    <td><a href="" class="label type-hint type-hint-boolean">Boolean</a></td>
    <td><p>True if SCE is enabled, false otherwise.  If you want to set the value, you
    have to do it at module config time on <a href="api/ng/provider/$sceProvider">$sceProvider</a>.</p>
</td>
  </tr>
</table>
    </li>
  
  <li id="parseAs">
    <h3><p><code>parseAs(type, expression);</code></p>

</h3>
    <div><p>Converts Angular <a href="guide/expression">expression</a> into a function.  This is like <a href="api/ng/service/$parse">$parse</a> and is identical when the expression is a literal constant.  Otherwise, it
wraps the expression in a call to <a href="api/ng/service/$sce#getTrusted">$sce.getTrusted(<em>type</em>,
<em>result</em>)</a></p>
</div>

    

    
    <h4>Parameters</h4>
    
<table class="variables-matrix input-arguments">
  <thead>
    <tr>
      <th>Param</th>
      <th>Type</th>
      <th>Details</th>
    </tr>
  </thead>
  <tbody>
    
    <tr>
      <td>
        type
        
        
      </td>
      <td>
        <a href="" class="label type-hint type-hint-string">string</a>
      </td>
      <td>
        <p>The SCE context in which this result will be used.</p>

        
      </td>
    </tr>
    
    <tr>
      <td>
        expression
        
        
      </td>
      <td>
        <a href="" class="label type-hint type-hint-string">string</a>
      </td>
      <td>
        <p>String expression to compile.</p>

        
      </td>
    </tr>
    
  </tbody>
</table>

    

    

    
    <h4>Returns</h4>
    <table class="variables-matrix return-arguments">
  <tr>
    <td><a href="" class="label type-hint type-hint-function">function(context, locals)</a></td>
    <td><p>A function which represents the compiled expression:</p>
<ul>
<li><code>context</code> – <code>{object}</code> – an object against which any expressions embedded in the
strings are evaluated against (typically a scope object).</li>
<li><code>locals</code> – <code>{object=}</code> – local variables context object, useful for overriding values
in <code>context</code>.</li>
</ul>
</td>
  </tr>
</table>
    </li>
  
  <li id="trustAs">
    <h3><p><code>trustAs(type, value);</code></p>

</h3>
    <div><p>Delegates to <a href="api/ng/service/$sceDelegate#trustAs"><code>$sceDelegate.trustAs</code></a>. As such, returns a
wrapped object that represents your value, and the trust you have in its safety for the given
context. AngularJS can then use that value as-is in bindings of the specified secure context.
This is used in bindings for <code>ng-bind-html</code>, <code>ng-include</code>, and most <code>src</code> attribute
interpolations. See <a href="api/ng/service/$sce">$sce</a> for strict contextual escaping.</p>
</div>

    

    
    <h4>Parameters</h4>
    
<table class="variables-matrix input-arguments">
  <thead>
    <tr>
      <th>Param</th>
      <th>Type</th>
      <th>Details</th>
    </tr>
  </thead>
  <tbody>
    
    <tr>
      <td>
        type
        
        
      </td>
      <td>
        <a href="" class="label type-hint type-hint-string">string</a>
      </td>
      <td>
        <p>The context in which this value is safe for use, e.g. <code>$sce.URL</code>,
    <code>$sce.RESOURCE_URL</code>, <code>$sce.HTML</code>, <code>$sce.JS</code> or <code>$sce.CSS</code>.</p>

        
      </td>
    </tr>
    
    <tr>
      <td>
        value
        
        
      </td>
      <td>
        <a href="" class="label type-hint type-hint-object">*</a>
      </td>
      <td>
        <p>The value that that should be considered trusted.</p>

        
      </td>
    </tr>
    
  </tbody>
</table>

    

    

    
    <h4>Returns</h4>
    <table class="variables-matrix return-arguments">
  <tr>
    <td><a href="" class="label type-hint type-hint-object">*</a></td>
    <td><p>A wrapped version of value that can be used as a trusted variant of your <code>value</code>
    in the context you specified.</p>
</td>
  </tr>
</table>
    </li>
  
  <li id="trustAsHtml">
    <h3><p><code>trustAsHtml(value);</code></p>

</h3>
    <div><p>Shorthand method.  <code>$sce.trustAsHtml(value)</code> →
    <a href="api/ng/service/$sceDelegate#trustAs"><code>$sceDelegate.trustAs($sce.HTML, value)</code></a></p>
</div>

    

    
    <h4>Parameters</h4>
    
<table class="variables-matrix input-arguments">
  <thead>
    <tr>
      <th>Param</th>
      <th>Type</th>
      <th>Details</th>
    </tr>
  </thead>
  <tbody>
    
    <tr>
      <td>
        value
        
        
      </td>
      <td>
        <a href="" class="label type-hint type-hint-object">*</a>
      </td>
      <td>
        <p>The value to mark as trusted for <code>$sce.HTML</code> context.</p>

        
      </td>
    </tr>
    
  </tbody>
</table>

    

    

    
    <h4>Returns</h4>
    <table class="variables-matrix return-arguments">
  <tr>
    <td><a href="" class="label type-hint type-hint-object">*</a></td>
    <td><p>A wrapped version of value that can be used as a trusted variant of your <code>value</code>
    in <code>$sce.HTML</code> context (like <code>ng-bind-html</code>).</p>
</td>
  </tr>
</table>
    </li>
  
  <li id="trustAsCss">
    <h3><p><code>trustAsCss(value);</code></p>

</h3>
    <div><p>Shorthand method.  <code>$sce.trustAsCss(value)</code> →
    <a href="api/ng/service/$sceDelegate#trustAs"><code>$sceDelegate.trustAs($sce.CSS, value)</code></a></p>
</div>

    

    
    <h4>Parameters</h4>
    
<table class="variables-matrix input-arguments">
  <thead>
    <tr>
      <th>Param</th>
      <th>Type</th>
      <th>Details</th>
    </tr>
  </thead>
  <tbody>
    
    <tr>
      <td>
        value
        
        
      </td>
      <td>
        <a href="" class="label type-hint type-hint-object">*</a>
      </td>
      <td>
        <p>The value to mark as trusted for <code>$sce.CSS</code> context.</p>

        
      </td>
    </tr>
    
  </tbody>
</table>

    

    

    
    <h4>Returns</h4>
    <table class="variables-matrix return-arguments">
  <tr>
    <td><a href="" class="label type-hint type-hint-object">*</a></td>
    <td><p>A wrapped version of value that can be used as a trusted variant
    of your <code>value</code> in <code>$sce.CSS</code> context. This context is currently unused, so there are
    almost no reasons to use this function so far.</p>
</td>
  </tr>
</table>
    </li>
  
  <li id="trustAsUrl">
    <h3><p><code>trustAsUrl(value);</code></p>

</h3>
    <div><p>Shorthand method.  <code>$sce.trustAsUrl(value)</code> →
    <a href="api/ng/service/$sceDelegate#trustAs"><code>$sceDelegate.trustAs($sce.URL, value)</code></a></p>
</div>

    

    
    <h4>Parameters</h4>
    
<table class="variables-matrix input-arguments">
  <thead>
    <tr>
      <th>Param</th>
      <th>Type</th>
      <th>Details</th>
    </tr>
  </thead>
  <tbody>
    
    <tr>
      <td>
        value
        
        
      </td>
      <td>
        <a href="" class="label type-hint type-hint-object">*</a>
      </td>
      <td>
        <p>The value to mark as trusted for <code>$sce.URL</code> context.</p>

        
      </td>
    </tr>
    
  </tbody>
</table>

    

    

    
    <h4>Returns</h4>
    <table class="variables-matrix return-arguments">
  <tr>
    <td><a href="" class="label type-hint type-hint-object">*</a></td>
    <td><p>A wrapped version of value that can be used as a trusted variant of your <code>value</code>
    in <code>$sce.URL</code> context. That context is currently unused, so there are almost no reasons
    to use this function so far.</p>
</td>
  </tr>
</table>
    </li>
  
  <li id="trustAsResourceUrl">
    <h3><p><code>trustAsResourceUrl(value);</code></p>

</h3>
    <div><p>Shorthand method.  <code>$sce.trustAsResourceUrl(value)</code> →
    <a href="api/ng/service/$sceDelegate#trustAs"><code>$sceDelegate.trustAs($sce.RESOURCE_URL, value)</code></a></p>
</div>

    

    
    <h4>Parameters</h4>
    
<table class="variables-matrix input-arguments">
  <thead>
    <tr>
      <th>Param</th>
      <th>Type</th>
      <th>Details</th>
    </tr>
  </thead>
  <tbody>
    
    <tr>
      <td>
        value
        
        
      </td>
      <td>
        <a href="" class="label type-hint type-hint-object">*</a>
      </td>
      <td>
        <p>The value to mark as trusted for <code>$sce.RESOURCE_URL</code> context.</p>

        
      </td>
    </tr>
    
  </tbody>
</table>

    

    

    
    <h4>Returns</h4>
    <table class="variables-matrix return-arguments">
  <tr>
    <td><a href="" class="label type-hint type-hint-object">*</a></td>
    <td><p>A wrapped version of value that can be used as a trusted variant of your <code>value</code>
    in <code>$sce.RESOURCE_URL</code> context (template URLs in <code>ng-include</code>, most <code>src</code> attribute
    bindings, ...)</p>
</td>
  </tr>
</table>
    </li>
  
  <li id="trustAsJs">
    <h3><p><code>trustAsJs(value);</code></p>

</h3>
    <div><p>Shorthand method.  <code>$sce.trustAsJs(value)</code> →
    <a href="api/ng/service/$sceDelegate#trustAs"><code>$sceDelegate.trustAs($sce.JS, value)</code></a></p>
</div>

    

    
    <h4>Parameters</h4>
    
<table class="variables-matrix input-arguments">
  <thead>
    <tr>
      <th>Param</th>
      <th>Type</th>
      <th>Details</th>
    </tr>
  </thead>
  <tbody>
    
    <tr>
      <td>
        value
        
        
      </td>
      <td>
        <a href="" class="label type-hint type-hint-object">*</a>
      </td>
      <td>
        <p>The value to mark as trusted for <code>$sce.JS</code> context.</p>

        
      </td>
    </tr>
    
  </tbody>
</table>

    

    

    
    <h4>Returns</h4>
    <table class="variables-matrix return-arguments">
  <tr>
    <td><a href="" class="label type-hint type-hint-object">*</a></td>
    <td><p>A wrapped version of value that can be used as a trusted variant of your <code>value</code>
    in <code>$sce.JS</code> context. That context is currently unused, so there are almost no reasons to
    use this function so far.</p>
</td>
  </tr>
</table>
    </li>
  
  <li id="getTrusted">
    <h3><p><code>getTrusted(type, maybeTrusted);</code></p>

</h3>
    <div><p>Delegates to <a href="api/ng/service/$sceDelegate#getTrusted"><code>$sceDelegate.getTrusted</code></a>.  As such,
takes any input, and either returns a value that&#39;s safe to use in the specified context,
or throws an exception. This function is aware of trusted values created by the <code>trustAs</code>
function and its shorthands, and when contexts are appropriate, returns the unwrapped value
as-is. Finally, this function can also throw when there is no way to turn <code>maybeTrusted</code> in a
safe value (e.g., no sanitization is available or possible.)</p>
</div>

    

    
    <h4>Parameters</h4>
    
<table class="variables-matrix input-arguments">
  <thead>
    <tr>
      <th>Param</th>
      <th>Type</th>
      <th>Details</th>
    </tr>
  </thead>
  <tbody>
    
    <tr>
      <td>
        type
        
        
      </td>
      <td>
        <a href="" class="label type-hint type-hint-string">string</a>
      </td>
      <td>
        <p>The context in which this value is to be used.</p>

        
      </td>
    </tr>
    
    <tr>
      <td>
        maybeTrusted
        
        
      </td>
      <td>
        <a href="" class="label type-hint type-hint-object">*</a>
      </td>
      <td>
        <p>The result of a prior <a href="api/ng/service/$sce#trustAs"><code>$sce.trustAs</code></a> call, or anything else (which will not be considered trusted.)</p>

        
      </td>
    </tr>
    
  </tbody>
</table>

    

    

    
    <h4>Returns</h4>
    <table class="variables-matrix return-arguments">
  <tr>
    <td><a href="" class="label type-hint type-hint-object">*</a></td>
    <td><p>A version of the value that&#39;s safe to use in the given context, or throws an
    exception if this is impossible.</p>
</td>
  </tr>
</table>
    </li>
  
  <li id="getTrustedHtml">
    <h3><p><code>getTrustedHtml(value);</code></p>

</h3>
    <div><p>Shorthand method.  <code>$sce.getTrustedHtml(value)</code> →
    <a href="api/ng/service/$sceDelegate#getTrusted"><code>$sceDelegate.getTrusted($sce.HTML, value)</code></a></p>
</div>

    

    
    <h4>Parameters</h4>
    
<table class="variables-matrix input-arguments">
  <thead>
    <tr>
      <th>Param</th>
      <th>Type</th>
      <th>Details</th>
    </tr>
  </thead>
  <tbody>
    
    <tr>
      <td>
        value
        
        
      </td>
      <td>
        <a href="" class="label type-hint type-hint-object">*</a>
      </td>
      <td>
        <p>The value to pass to <code>$sce.getTrusted</code>.</p>

        
      </td>
    </tr>
    
  </tbody>
</table>

    

    

    
    <h4>Returns</h4>
    <table class="variables-matrix return-arguments">
  <tr>
    <td><a href="" class="label type-hint type-hint-object">*</a></td>
    <td><p>The return value of <code>$sce.getTrusted($sce.HTML, value)</code></p>
</td>
  </tr>
</table>
    </li>
  
  <li id="getTrustedCss">
    <h3><p><code>getTrustedCss(value);</code></p>

</h3>
    <div><p>Shorthand method.  <code>$sce.getTrustedCss(value)</code> →
    <a href="api/ng/service/$sceDelegate#getTrusted"><code>$sceDelegate.getTrusted($sce.CSS, value)</code></a></p>
</div>

    

    
    <h4>Parameters</h4>
    
<table class="variables-matrix input-arguments">
  <thead>
    <tr>
      <th>Param</th>
      <th>Type</th>
      <th>Details</th>
    </tr>
  </thead>
  <tbody>
    
    <tr>
      <td>
        value
        
        
      </td>
      <td>
        <a href="" class="label type-hint type-hint-object">*</a>
      </td>
      <td>
        <p>The value to pass to <code>$sce.getTrusted</code>.</p>

        
      </td>
    </tr>
    
  </tbody>
</table>

    

    

    
    <h4>Returns</h4>
    <table class="variables-matrix return-arguments">
  <tr>
    <td><a href="" class="label type-hint type-hint-object">*</a></td>
    <td><p>The return value of <code>$sce.getTrusted($sce.CSS, value)</code></p>
</td>
  </tr>
</table>
    </li>
  
  <li id="getTrustedUrl">
    <h3><p><code>getTrustedUrl(value);</code></p>

</h3>
    <div><p>Shorthand method.  <code>$sce.getTrustedUrl(value)</code> →
    <a href="api/ng/service/$sceDelegate#getTrusted"><code>$sceDelegate.getTrusted($sce.URL, value)</code></a></p>
</div>

    

    
    <h4>Parameters</h4>
    
<table class="variables-matrix input-arguments">
  <thead>
    <tr>
      <th>Param</th>
      <th>Type</th>
      <th>Details</th>
    </tr>
  </thead>
  <tbody>
    
    <tr>
      <td>
        value
        
        
      </td>
      <td>
        <a href="" class="label type-hint type-hint-object">*</a>
      </td>
      <td>
        <p>The value to pass to <code>$sce.getTrusted</code>.</p>

        
      </td>
    </tr>
    
  </tbody>
</table>

    

    

    
    <h4>Returns</h4>
    <table class="variables-matrix return-arguments">
  <tr>
    <td><a href="" class="label type-hint type-hint-object">*</a></td>
    <td><p>The return value of <code>$sce.getTrusted($sce.URL, value)</code></p>
</td>
  </tr>
</table>
    </li>
  
  <li id="getTrustedResourceUrl">
    <h3><p><code>getTrustedResourceUrl(value);</code></p>

</h3>
    <div><p>Shorthand method.  <code>$sce.getTrustedResourceUrl(value)</code> →
    <a href="api/ng/service/$sceDelegate#getTrusted"><code>$sceDelegate.getTrusted($sce.RESOURCE_URL, value)</code></a></p>
</div>

    

    
    <h4>Parameters</h4>
    
<table class="variables-matrix input-arguments">
  <thead>
    <tr>
      <th>Param</th>
      <th>Type</th>
      <th>Details</th>
    </tr>
  </thead>
  <tbody>
    
    <tr>
      <td>
        value
        
        
      </td>
      <td>
        <a href="" class="label type-hint type-hint-object">*</a>
      </td>
      <td>
        <p>The value to pass to <code>$sceDelegate.getTrusted</code>.</p>

        
      </td>
    </tr>
    
  </tbody>
</table>

    

    

    
    <h4>Returns</h4>
    <table class="variables-matrix return-arguments">
  <tr>
    <td><a href="" class="label type-hint type-hint-object">*</a></td>
    <td><p>The return value of <code>$sce.getTrusted($sce.RESOURCE_URL, value)</code></p>
</td>
  </tr>
</table>
    </li>
  
  <li id="getTrustedJs">
    <h3><p><code>getTrustedJs(value);</code></p>

</h3>
    <div><p>Shorthand method.  <code>$sce.getTrustedJs(value)</code> →
    <a href="api/ng/service/$sceDelegate#getTrusted"><code>$sceDelegate.getTrusted($sce.JS, value)</code></a></p>
</div>

    

    
    <h4>Parameters</h4>
    
<table class="variables-matrix input-arguments">
  <thead>
    <tr>
      <th>Param</th>
      <th>Type</th>
      <th>Details</th>
    </tr>
  </thead>
  <tbody>
    
    <tr>
      <td>
        value
        
        
      </td>
      <td>
        <a href="" class="label type-hint type-hint-object">*</a>
      </td>
      <td>
        <p>The value to pass to <code>$sce.getTrusted</code>.</p>

        
      </td>
    </tr>
    
  </tbody>
</table>

    

    

    
    <h4>Returns</h4>
    <table class="variables-matrix return-arguments">
  <tr>
    <td><a href="" class="label type-hint type-hint-object">*</a></td>
    <td><p>The return value of <code>$sce.getTrusted($sce.JS, value)</code></p>
</td>
  </tr>
</table>
    </li>
  
  <li id="parseAsHtml">
    <h3><p><code>parseAsHtml(expression);</code></p>

</h3>
    <div><p>Shorthand method.  <code>$sce.parseAsHtml(expression string)</code> →
    <a href="api/ng/service/$sce#parseAs"><code>$sce.parseAs($sce.HTML, value)</code></a></p>
</div>

    

    
    <h4>Parameters</h4>
    
<table class="variables-matrix input-arguments">
  <thead>
    <tr>
      <th>Param</th>
      <th>Type</th>
      <th>Details</th>
    </tr>
  </thead>
  <tbody>
    
    <tr>
      <td>
        expression
        
        
      </td>
      <td>
        <a href="" class="label type-hint type-hint-string">string</a>
      </td>
      <td>
        <p>String expression to compile.</p>

        
      </td>
    </tr>
    
  </tbody>
</table>

    

    

    
    <h4>Returns</h4>
    <table class="variables-matrix return-arguments">
  <tr>
    <td><a href="" class="label type-hint type-hint-function">function(context, locals)</a></td>
    <td><p>A function which represents the compiled expression:</p>
<ul>
<li><code>context</code> – <code>{object}</code> – an object against which any expressions embedded in the
strings are evaluated against (typically a scope object).</li>
<li><code>locals</code> – <code>{object=}</code> – local variables context object, useful for overriding values
in <code>context</code>.</li>
</ul>
</td>
  </tr>
</table>
    </li>
  
  <li id="parseAsCss">
    <h3><p><code>parseAsCss(expression);</code></p>

</h3>
    <div><p>Shorthand method.  <code>$sce.parseAsCss(value)</code> →
    <a href="api/ng/service/$sce#parseAs"><code>$sce.parseAs($sce.CSS, value)</code></a></p>
</div>

    

    
    <h4>Parameters</h4>
    
<table class="variables-matrix input-arguments">
  <thead>
    <tr>
      <th>Param</th>
      <th>Type</th>
      <th>Details</th>
    </tr>
  </thead>
  <tbody>
    
    <tr>
      <td>
        expression
        
        
      </td>
      <td>
        <a href="" class="label type-hint type-hint-string">string</a>
      </td>
      <td>
        <p>String expression to compile.</p>

        
      </td>
    </tr>
    
  </tbody>
</table>

    

    

    
    <h4>Returns</h4>
    <table class="variables-matrix return-arguments">
  <tr>
    <td><a href="" class="label type-hint type-hint-function">function(context, locals)</a></td>
    <td><p>A function which represents the compiled expression:</p>
<ul>
<li><code>context</code> – <code>{object}</code> – an object against which any expressions embedded in the
strings are evaluated against (typically a scope object).</li>
<li><code>locals</code> – <code>{object=}</code> – local variables context object, useful for overriding values
in <code>context</code>.</li>
</ul>
</td>
  </tr>
</table>
    </li>
  
  <li id="parseAsUrl">
    <h3><p><code>parseAsUrl(expression);</code></p>

</h3>
    <div><p>Shorthand method.  <code>$sce.parseAsUrl(value)</code> →
    <a href="api/ng/service/$sce#parseAs"><code>$sce.parseAs($sce.URL, value)</code></a></p>
</div>

    

    
    <h4>Parameters</h4>
    
<table class="variables-matrix input-arguments">
  <thead>
    <tr>
      <th>Param</th>
      <th>Type</th>
      <th>Details</th>
    </tr>
  </thead>
  <tbody>
    
    <tr>
      <td>
        expression
        
        
      </td>
      <td>
        <a href="" class="label type-hint type-hint-string">string</a>
      </td>
      <td>
        <p>String expression to compile.</p>

        
      </td>
    </tr>
    
  </tbody>
</table>

    

    

    
    <h4>Returns</h4>
    <table class="variables-matrix return-arguments">
  <tr>
    <td><a href="" class="label type-hint type-hint-function">function(context, locals)</a></td>
    <td><p>A function which represents the compiled expression:</p>
<ul>
<li><code>context</code> – <code>{object}</code> – an object against which any expressions embedded in the
strings are evaluated against (typically a scope object).</li>
<li><code>locals</code> – <code>{object=}</code> – local variables context object, useful for overriding values
in <code>context</code>.</li>
</ul>
</td>
  </tr>
</table>
    </li>
  
  <li id="parseAsResourceUrl">
    <h3><p><code>parseAsResourceUrl(expression);</code></p>

</h3>
    <div><p>Shorthand method.  <code>$sce.parseAsResourceUrl(value)</code> →
    <a href="api/ng/service/$sce#parseAs"><code>$sce.parseAs($sce.RESOURCE_URL, value)</code></a></p>
</div>

    

    
    <h4>Parameters</h4>
    
<table class="variables-matrix input-arguments">
  <thead>
    <tr>
      <th>Param</th>
      <th>Type</th>
      <th>Details</th>
    </tr>
  </thead>
  <tbody>
    
    <tr>
      <td>
        expression
        
        
      </td>
      <td>
        <a href="" class="label type-hint type-hint-string">string</a>
      </td>
      <td>
        <p>String expression to compile.</p>

        
      </td>
    </tr>
    
  </tbody>
</table>

    

    

    
    <h4>Returns</h4>
    <table class="variables-matrix return-arguments">
  <tr>
    <td><a href="" class="label type-hint type-hint-function">function(context, locals)</a></td>
    <td><p>A function which represents the compiled expression:</p>
<ul>
<li><code>context</code> – <code>{object}</code> – an object against which any expressions embedded in the
strings are evaluated against (typically a scope object).</li>
<li><code>locals</code> – <code>{object=}</code> – local variables context object, useful for overriding values
in <code>context</code>.</li>
</ul>
</td>
  </tr>
</table>
    </li>
  
  <li id="parseAsJs">
    <h3><p><code>parseAsJs(expression);</code></p>

</h3>
    <div><p>Shorthand method.  <code>$sce.parseAsJs(value)</code> →
    <a href="api/ng/service/$sce#parseAs"><code>$sce.parseAs($sce.JS, value)</code></a></p>
</div>

    

    
    <h4>Parameters</h4>
    
<table class="variables-matrix input-arguments">
  <thead>
    <tr>
      <th>Param</th>
      <th>Type</th>
      <th>Details</th>
    </tr>
  </thead>
  <tbody>
    
    <tr>
      <td>
        expression
        
        
      </td>
      <td>
        <a href="" class="label type-hint type-hint-string">string</a>
      </td>
      <td>
        <p>String expression to compile.</p>

        
      </td>
    </tr>
    
  </tbody>
</table>

    

    

    
    <h4>Returns</h4>
    <table class="variables-matrix return-arguments">
  <tr>
    <td><a href="" class="label type-hint type-hint-function">function(context, locals)</a></td>
    <td><p>A function which represents the compiled expression:</p>
<ul>
<li><code>context</code> – <code>{object}</code> – an object against which any expressions embedded in the
strings are evaluated against (typically a scope object).</li>
<li><code>locals</code> – <code>{object=}</code> – local variables context object, useful for overriding values
in <code>context</code>.</li>
</ul>
</td>
  </tr>
</table>
    </li>
  </ul>
  
  



  
</div>


